<template>
  <div class="xmlReview">
    <div class="review">
      <h1 class="title">邮件模板预览</h1>
      <h2>主题：<span>{{info.title}}</span></h2>
      <div v-html="info.content"></div>
      <div class="else-file" v-show="info.attaches.length>0">
        <h3>附件 <i class="iconfont icon-wenjian"></i></h3>
        <MailFile :list ="info.attaches"></MailFile>
      </div>
      <!-- 发件人-->
<!--      <p class="send-name">-->
<!--        <span>发件人：</span>{{info.senderName}}<{{info.senderEmail}}>-->
<!--      </p>-->
    </div>
  </div>
</template>

<script>
    import {mailTemplateDetail} from '@/api/automation/mail'
    import  MailFile from '@/components/mail/file/MailFile'
    export default {
        name: "mailReview",
        components:{MailFile},
        data() {
            return {
                info: {}
            }
        },
        mounted() {
            this.getDetail()
        },
        methods: {
            getDetail() {
                mailTemplateDetail(this.$route.params.id).then(res => {
                    if (res.data.success) {
                        this.info = res.data.data;
                        this.info.content = decodeURIComponent(this.info.content)
                    }
                })
            },
            //转换文件单位
            dealSize(size) {
                size = size.toString();
                if (size.indexOf('KB') != -1) {
                    return size;
                }
                let result = parseInt(size / 1024);
                if (result > 1024) {
                    return parseInt(result / 1024) + 'M';
                }
                return result + 'KB';
            },
            //判断文件类型
            filterType(str) {
                const arr = ['.jpeg', '.png', '.jpg'];
                let state = false;
                arr.map(item => {
                    if (str.indexOf(item) != -1) {
                        state = true
                    }
                })
                return state;
            }
        }
    }
</script>

<style scoped lang="scss">
  .xmlReview {
    width: 1200px;
    margin: 0 auto;
    background-color: #fff;
    overflow-y: scroll;
    height: 100%;

    .review {
      width: 1024px;
      margin: 0 auto 100px;

      .title {
        color: #435B77;
        line-height: 40px;
        font-size: 19px;
        padding: 80px 0 70px 0;
      }

      h2 {
        font-size: 16px;
        color: #000;
        line-height: 45px;

        span {
          font-size: 17px;
        }
      }

      .review-content {
        text-indent: 2rem;
        font-size: 15px;
        line-height: 35px;
      }

      .else-file {
        margin-top: 20px;

        h3 {
          font-size: 15px;
          color: #000;
          line-height: 40px;
          margin-bottom: 10px;
        }

      }

      .send-name {
        font-size: 13px;
        color: #333;
        line-height: 35px;
        margin-top: 20px !important;

        span {
          font-size: 14px;
          color: #000;
        }
      }
    }
  }
</style>
